<template>
  <div>
    <!-- 自定义指令 -->
    自定义指令
    <input type="text" name="" id="" v-Focus />
    <button v-edit="{key:'edit',permiss}">编辑</button>
    <button v-delete="{key:'delete',permiss}">删除</button>
  </div>
</template>

<script setup>
import { useRoute } from "vue-router"
//路由
const route = useRoute()
//路由里面的permiss
const permiss = route.meta.permiss

const vFocus = {
  mounted(el,binging) {
    el.focus()
    el.style.border = '1px solid red'
    // el.setAttribute('style', 'border:1px solid green')
    // console.log(el)
  },
    // created(el) {
    //   el.focus()
    //   // console.log(el)
    // }
}

// const vEdit={
//    mounted:(el,binging)=>{
//     if(!permiss[binging.value]){
//       el.style.display = 'none'
//     }
//     else{
//       el.style.display = 'block'
//     }
//    }
// }
// const vDelete ={
//   mounted:(el,binging)=>{
//    el.style.display = permiss[binging.value]?'block':'none'
//   }
// }
</script>

<style scoped>
</style>